<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
 <%@ taglib prefix="s" uri="/struts-tags"%>

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<script type="text/javascript">
 function getCountry()
 {
	 	var xmlhttp;
		if (window.XMLHttpRequest)
	  	{
		  	// code for IE7+, Firefox, Chrome, Opera, Safari
	  		xmlhttp=new XMLHttpRequest();
	  	}
		else
	  	{
		  	// code for IE6, IE5
	  		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  	}
		xmlhttp.onreadystatechange=function()
	  	{
	  		if (xmlhttp.readyState==4 && xmlhttp.status==200)
	    	{
	       		document.getElementById("country").innerHTML=xmlhttp.responseText;
	       		document.getElementById("state").innerHTML="";
	       		document.getElementById("region").innerHTML="";
	       		document.getElementById("city").innerHTML="";
	    	}
	  	}
		req = "getCountry?categoryId="+document.getElementById('continentId').value;
		xmlhttp.open("GET",req,true);
		xmlhttp.send();
 }
 function getState()
 {
	 var xmlhttp;
		if (window.XMLHttpRequest)
	  	{
		  	// code for IE7+, Firefox, Chrome, Opera, Safari
	  		xmlhttp=new XMLHttpRequest();
	  	}
		else
	  	{
		  	// code for IE6, IE5
	  		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  	}
		xmlhttp.onreadystatechange=function()
	  	{
	  		if (xmlhttp.readyState==4 && xmlhttp.status==200)
	    	{
	       		document.getElementById("state").innerHTML=xmlhttp.responseText;
	       		document.getElementById("region").innerHTML="";
	       		document.getElementById("city").innerHTML="";
	    	}
	  	}
		req = "getState?categoryId="+document.getElementById('countryId').value;
		xmlhttp.open("GET",req,true);
		xmlhttp.send();
 }
 function getRegion()
 {
	 if(document.getElementById("stateId").value == "NA")
	 {
		 document.getElementById("state").innerHTML="<input type='text' name='stateId' value=''>";
		 document.getElementById("region").innerHTML="<input type='text' name='regionId' value=''>";
    	 document.getElementById("city").innerHTML="<input type='text' name='cityId' value=''>";
	 }
	 else
	 {
	 	var xmlhttp;
		if(window.XMLHttpRequest)
	  	{
		  	// code for IE7+, Firefox, Chrome, Opera, Safari
	  		xmlhttp=new XMLHttpRequest();
	  	}
		else
	  	{
		  	// code for IE6, IE5
	  		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  	}
		xmlhttp.onreadystatechange=function()
	  	{
	  		if (xmlhttp.readyState==4 && xmlhttp.status==200)
	    	{
	       		document.getElementById("region").innerHTML=xmlhttp.responseText;
	       		document.getElementById("city").innerHTML="";
	    	}
	  	}
		req = "getRegion?categoryId="+document.getElementById('stateId').value;
		xmlhttp.open("GET",req,true);
		xmlhttp.send();
	 }
 }
function otherCity()
{
	 if(document.getElementById("cityId").value == "NA")
	 {
    	 document.getElementById("city").innerHTML="<input type='text' name='cityId' value=''>";
	 }
}
 function getCity()
 {
	 if(document.getElementById("regionId").value == "NA")
	 {
		 document.getElementById("region").innerHTML="<input type='text' name='regionId' value=''>";
    	 document.getElementById("city").innerHTML="<input type='text' name='cityId' value=''>";
	 }
	 else
	 {
	 	var xmlhttp;
		if(window.XMLHttpRequest)
	  	{
		  	// code for IE7+, Firefox, Chrome, Opera, Safari
	  		xmlhttp=new XMLHttpRequest();
	  	}
		else
	  	{
		  	// code for IE6, IE5
	  		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	  	}
		xmlhttp.onreadystatechange=function()
	  	{
	  		if (xmlhttp.readyState==4 && xmlhttp.status==200)
	    	{
	       		document.getElementById("city").innerHTML=xmlhttp.responseText;
	    	}
	  	}
		req = "getCity?categoryId="+document.getElementById('regionId').value;
		xmlhttp.open("GET",req,true);
		xmlhttp.send();
	 }
 }
 </script>
 
<form name="saveProduct" action="saveProduct" method="post">
<s:set name="prodOwnerId" value="#session.uuid"/>
	<input type="hidden" name="prodOwnerId" value="${prodOwnerId}">
	<table>
		<tr><td></td><td>Name</td><td><input type="text" name="name" value="${product.name}"></td></tr>
		<tr><td></td><td>SKU</td><td><input type="hidden" name="userId" value="${userId}"><input type="text" name="sku" value="${product.sku}"></td></tr>
		<tr><td></td><td>Enabled</td><td><input type="checkbox" name="enabled" value="true" <s:if test="product.enabled == true">checked</s:if>></td></tr>
	</table>
		<div style="font-size: 17px; font-weight: bold; margin-left: 30px;">Property Location</div>
	<table>
		<tr>
			<td>Address Line1</td><td></td>
		</tr>
		<tr>
			<td>
				Continent 
			</td>
			<td>
				<select name="continentId" id="continentId" onchange="getCountry()">
					<option value="-1">Select</option>
					<option value="0">NA</option>
					<s:iterator value="continents" var="continent">
						<option value="${continent.uuid}">${continent.name}</option>
					</s:iterator>
				</select>
			</td>
		</tr>
		<tr>
			<td>
				Country
			</td>
			<td>
				<div id="country"></div>
			</td>
		</tr>
		<tr>
			<td>
				State
			</td>
			<td>
				<div id="state"></div>
			</td>
		</tr>
		<tr>
			<td>
				Region
			</td>
			<td>
				<div id="region"></div>
			</td>
		</tr>
		<tr>
			<td>
				City
			</td>
			<td>
				<div id="city"></div>
			</td>
		</tr>
		<tr>
			<td>
				<input type="submit" name="create" value="Save">
			</td>
			<td>
				<input type="reset" name="reset" value="Reset">
			</td>
		</tr>
	</table>	
 </form>